import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_demo/pages/profile/components/base_info.dart';
import 'package:flutter_demo/pages/profile/components/custom_title.dart';
import 'package:flutter_demo/pages/profile/components/gift_view.dart';
import 'package:flutter_demo/pages/profile/components/head_view.dart';
import 'package:flutter_demo/pages/profile/components/skill_list.dart';
import 'package:flutter_demo/pages/profile/components/tag.dart';

class ProfilePage extends StatefulWidget {
  const ProfilePage({super.key, required this.title});

  final String title;

  @override
  State<ProfilePage> createState() => _ProfilePageState();
}

class _ProfilePageState extends State<ProfilePage> {
  double _scrollProgress = 0;
  int _alpha = 0;

  final ScrollController _scrollController =
      ScrollController(); // 创建 ScrollController

  void _scrollListener() {
    // 计算滚动进度
    double maxScrollExtent = 100;
    double pixels = _scrollController.position.pixels;
    _scrollProgress = min(pixels <= 0 ? 0 : pixels / maxScrollExtent, 1);

    _alpha = (_scrollProgress * 255).toInt();

    // ！ 触发状态更新
    setState(() {});
  }

  @override
  void initState() {
    super.initState();
    _scrollController.addListener(_scrollListener);
  }

  @override
  void dispose() {
    _scrollController.dispose(); // 销毁 ScrollController
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBodyBehindAppBar: true,
      appBar: AppBar(
        backgroundColor: Colors.white.withAlpha(_alpha),
        elevation: 0,
        scrolledUnderElevation: 0,
        shape: Border(
          bottom: BorderSide(
            color: const Color(0xFFF4F4F4).withAlpha(_alpha), // 边框颜色
            width: 1, // 边框宽度
          ),
        ),
        // 右侧按钮
        actions: const [
          Opacity(
            opacity: 0,
            child: IconButton(
              icon: Icon(Icons.settings),
              color: Colors.transparent,
              onPressed: null,
            ),
          )
        ],
        leading: IconButton(
          icon: const Icon(Icons.arrow_back),
          color: Color.lerp(Colors.white, Colors.black, _scrollProgress),
          onPressed: () {
            Navigator.pop(context);
          },
        ),
        title: CustomTitle(
          title: widget.title,
          userName: '潇潇洒洒',
          userId: '1210301104',
          alpha: _alpha,
          scrollProgress: _scrollProgress,
          avatarPath: 'assets/images/avatar.jpg',
        ),
      ),
      body: SafeArea(
        top: false,
        child: Column(
          children: [
            // container 高度为父容器去除底部 action bar 的高度
            Expanded(
              child: Container(
                width: double.infinity,
                color: Colors.white,
                child:
                    // 页面内容
                    SingleChildScrollView(
                  controller:
                      _scrollController, // 将 ScrollController 传递给 SingleChildScrollView
                  // physics: const BouncingScrollPhysics(),
                  child: Column(
                    children: [
                      const HeadView(),
                      Container(
                        // 背景颜色为从上到下的渐变，从白到浅灰
                        decoration: const BoxDecoration(
                          gradient: LinearGradient(
                            colors: [
                              Colors.white,
                              Color(0xFFF2F2F2),
                            ],
                            begin: Alignment.topCenter,
                            end: Alignment.bottomCenter,
                          ),
                        ),
                        child: const Column(
                          children: [
                            BaseInfo(),
                            GiftView(),
                            SizedBox(height: 8),
                            SkillList()
                          ],
                        ),
                      )
                    ],
                  ),
                ),
              ),
            ),
            // action bar
            Container(
              color: Colors.white,
              child: Padding(
                padding:
                    const EdgeInsets.symmetric(horizontal: 20, vertical: 14),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  // 间隔20

                  children: [
                    // 左侧圆形按钮，背景色#f4f4f4，内容为本地图片居中
                    GestureDetector(
                      onTap: () {},
                      child: CircleAvatar(
                        radius: 24,
                        backgroundColor: const Color(0xFFF4F4F4),
                        // 图片大小为 26
                        child: Image.asset(
                          'assets/images/gift.png',
                          width: 28,
                          height: 28,
                        ),
                      ),
                    ),
                    const SizedBox(
                      width: 20,
                    ),
                    Expanded(
                      child: Container(
                        height: 48,
                        alignment: Alignment.center,
                        decoration: const BoxDecoration(
                          borderRadius: BorderRadius.all(Radius.circular(24)),
                          gradient: LinearGradient(
                            colors: [
                              Color(0xFF9775FB),
                              Color(0xFFD3AEF4),
                            ],
                            begin: Alignment.centerLeft,
                            end: Alignment.centerRight,
                          ),
                        ),
                        child: const Text(
                          '聊天',
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 18,
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
